<template>
  <div id="activity-detail">
    <h1>{{ activity.name }}</h1>
    <p>{{ activity.time }}</p>
    <p>{{ activity.location }}</p>
    <p>{{ activity.description }}</p>
    <img :src="activity.imageUrl" alt="活动图片" style="width: 1000px; height: 800px;">
    <!-- 其他活动详情内容 -->
  </div>
</template>

<script>
import { fetchActivityDetails } from '../api/api';
export default {
  name: 'activitydetail',
  data() {
    return {
      activity: {} // 用于存储活动详情的数据
    };
  },
  created() {
    this.fetchActivityDetails(); // 在组件创建时获取活动详情数据
    // 当组件实例被创建时执行
    if (this.$route.query.refresh) {
      // 如果 URL 中包含 refresh 参数，重定向到首页
      this.$router.push('/');
    }
  },
methods: {
  fetchActivityDetails() {
    const activityId = this.$route.params.id; // 从路由参数中获取活动 ID
    fetchActivityDetails(activityId)
      .then(response => {
        this.activity = response.data;
      })
      .catch(error => {
        console.log(error);
      })
  }
}
}
</script>